<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>报损报溢</title>
		<link rel="stylesheet" href="../../lib/layui-v2.6.3/css/layui.css" media="all" />
		<link rel="stylesheet" href="../../css/public.css" media="all">
		<style>
			.layui-tab-title li {
				border: 1px solid #EBEBEB;
				border-left: none;
				border-top: none;
				border-bottom: none;
				background-color: #FFFFFF;
			}

			.layui-table,
			.layui-table-view {
				margin: 0;
			}

			.layui-show {
				background-color: white
			}
		</style>
	</head>
	<body>
		<div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
			<ul class="layui-tab-title" style="border-bottom: 1px solid lightgray;">
				<li class="layui-this">报损/报溢</li>
				<li>报损/报溢查询</li>
			</ul>
			<div class="layui-tab-content" style="height: 100px;padding: 0">
				<!-- 报损/报溢 -->
				<div class="layui-tab-item layui-show">
					<!-- 标题及单号 -->
					<div>
						<div style="text-align: center">
							<h2 id="comStateTittle" style="font-weight: 800;padding-top: 30px;">商品报损</h2>
						</div>
						<div style="text-align: right;color: red; width: 100%; margin-bottom: 10px;">
							<span style="padding-right: 100px;font-weight: 500">单号：
								<span id="breakOddNumbers">BS220222010001</span>
							</span>
						</div>
					</div>
					<!-- 顶部表单功能栏 -->
					<form class="layui-form" id="breakageInfoTop" lay-filter="breakageInfoTop">
						<div class="layui-panel" style="padding: 20px 0 20px 0">
							<!-- 单据类型 -->
							<div class="layui-inline">
								<label class="layui-form-label">单据类型：</label>
								<div class="layui-input-inline">
									<select class="combeakorover" name="receiptsType" id="receiptsType" lay-filter="combeakorover">
										<option value="报损" selected="">商品报损</option>
										<option value="报溢">商品报溢</option>
									</select>
									<input type="hidden" name="proBadId">
								</div>
							</div>

							<!-- 仓库名称 -->
							<div class="layui-inline" style="margin-left: 100px;">
								<label class="layui-form-label">仓库名称：</label>
								<div class="layui-input-inline" id="selectDepot">
									<select name="depotId" id="depotId" lay-filter="depotId">
									</select>
								</div>
							</div>

							<!-- 报损日期 -->
							<div class="layui-inline" style="margin-left: 100px;">
								<label class="layui-form-label" id="comStateDate">报损日期：</label>
								<div class="layui-input-inline">
									<input type="text" name="proBadDate" id="proBadDate" autocomplete="off" class="layui-input">
								</div>
							</div>
						</div>
					</form>

					<!-- 商品报损报溢表 -->
					<table class="layui-hide" id="comBreakOverflow" lay-filter="comBreakOverflow"></table>

					<!-- 添加商品添加和选中删除工具栏 -->
					<script type="text/html" id="addcomtoolbar">
						<div class="layui-btn-container">
							<button class="layui-btn layui-btn-sm" lay-event="getAddCom">添加商品</button>
							<button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="getDelCom">删除商品</button>
						</div>
					</script>

					<!-- 添加编辑操作 -->
					<script type="text/html" id="operateBar">
						<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
					</script>

					<!-- 底部表单功能栏 -->
					<form class="layui-form" id="breakageInfoDown" lay-filter="breakageInfoDown">
						<div class="layui-panel" style="padding: 20px 0 20px 0">
							<!-- 经办人 -->
							<div class="layui-inline" style="margin-left: 0px;">
								<label class="layui-form-label">经办人：</label>
								<div class="layui-input-inline">
									<select name="empId" id="empId" lay-filter="empId">
									</select>
								</div>
							</div>

							<!-- 备注 -->
							<div class="layui-inline">
								<label class="layui-form-label">备注：</label>
								<div class="layui-input-inline">
									<input type="text" class="layui-input" name="proBadComment" style="width: 450px;">
								</div>
							</div>

							<!-- 提交按钮 -->
							<div class="layui-inline" style="margin-left: 300px;">
								<button type="button" class="layui-btn layui-btn-radius" lay-submit lay-filter="commitBreakInfoBtn">提交</button>
							</div>
						</div>
					</form>
				</div>

				<!-- 报损/报溢查询 -->
				<div class="layui-tab-item">
					<!-- 搜索功能栏 -->
					<form class="layui-form" id="searchBreakInfo">
						<div class="layui-panel" style="padding: 20px 0 0 0">
							<div class="layui-form-item layui-font-black ">
								<!-- 报损时间 -->
								<div class="layui-inline">
									<label class="layui-form-label" id="breakMoreDate">报损时间：</label>
									<div class="layui-input-inline">
										<input type="text" name="startBreakageDate" id="startBreakageDate"
											autocomplete="off" class="layui-input">
									</div>
									<div style="display: inline-block;float: left;padding: 10px 13px 0 0;">至</div>
									<div class="layui-input-inline">
										<input type="text" name="stopBreakageDate" id="stopBreakageDate"
											autocomplete="off" class="layui-input">
									</div>
								</div>
								<!-- 单据类型 -->
								<div class="layui-inline">
									<label class="layui-form-label">单据类型：</label>
									<div class="layui-input-inline">
										<select class="receiptsType" name="receiptsType" lay-filter="receiptsType">
											<option value="报损" selected="">商品报损</option>
											<option value="报溢">商品报溢</option>
										</select>
									</div>
								</div>
								<!-- 搜索按钮 -->
								<div class="layui-inline" style="margin-left: 100px;">
									<button type="button" class="layui-btn layui-btn-primary" lay-submit
										lay-filter="data-searchBreakMore-btn">
										<i class="layui-icon">&#xe615;</i> 查 询
									</button>
								</div>
								<!-- 重置按钮 -->
								<div class="layui-inline">
									<button id="btnReset" class="layui-btn icon-btn">
										<i class="layui-icon">&#xe669;</i> 重 置
									</button>
								</div>
							</div>
						</div>
					</form>

					<!--库存报损列表-->
					<fieldset class="layui-elem-field layui-field-title"
						style="margin-top: 10px;border: 1px solid lightgray;">
						<legend style="font-size: 17px;color: dimgray;">
							库存<span id="inventoryList">报损</span>列表：
						</legend>
						<!-- 库存报损列表 -->
						<table class="layui-hide" id="invBreakList" lay-filter="invBreakList"></table>
					</fieldset>
					<!--单据的详细信息-->
					<fieldset class="layui-elem-field layui-field-title"
						style="margin-top: 10px;border: 1px solid lightgray;">
						<legend style="font-size: 17px;color: dimgray;">单据的详细信息：
							<span class="title01" style="font-size: 15px; color: red;"></span>
						</legend>
						<!-- 单据的详细信息表 -->
						<table class="layui-hide" id="invReceiptsDesc" lay-filter="invReceiptsDesc"></table>
					</fieldset>

				</div>
			</div>
		</div>
		<script src="../../lib/layui-v2.6.3/layui.js" charset="UTF-8"></script>
		<script src="../../lib/jquery-3.4.1/jquery-3.4.1.min.js"></script>
		<script>
			$(function(){
                //声明一个用于保存所选报损或者报溢商品信息的数组
                var chooseBreakInfoLists = [];
                window.chooseBreakInfoLists = chooseBreakInfoLists;
				layui.use(['form','table','layer','laydate'],function(){
					var $ = layui.jquery,
						form = layui.form,
						table = layui.table,
						layer = layui.layer,
						laydate = layui.laydate;

					/**************************************** 报损/报溢 ********************************************/
                    //日期控件
                    var now = new Date();
                    laydate.render({
                        elem: "#proBadDate",
                        value: now
                    });

                    //封装单据类型和仓库选择状态
                    var renderSelects = function () {
                        if(0 != breakageCounts){
                            $("#depotId").attr("disabled",true);
                            $("#receiptsType").attr("disabled",true);
                            form.render('select');
                        }else {
                            $("#depotId").attr("disabled",false);
                            $("#receiptsType").attr("disabled",false);
                            form.render('select');
                        }
                    };
                    renderSelects ();

					var breakageCounts;
                    var tableList = [];

                    //商品报损报溢表
                    tableList[0] = table.render({
						 elem: '#comBreakOverflow',
						 data: chooseBreakInfoLists,
						 toolbar: '#addcomtoolbar',
						 defaultToolbar: ['filter', 'exports', 'print', {
							 title: '提示',
							 layEvent: 'LAYTABLE_TIPS',
							 icon: 'layui-icon-tips'
						 }],
						 totalRow: true,
						 cols: [[
							 {type: 'checkbox', fixed: 'left'},
							 {field: 'proId', width: 110, title: '商品编号', sort: true, fixed: 'left', align: "center", totalRowText: '合计：'},
							 {field: 'inveDescName', minWidth: 210, title: '商品名称', align: "center"},
							 {field: 'inveDescUnit', width: 80, title: '单位', align: "center"},
							 {field: 'inveDescSize', width: 100, title: '产品规格', align: "center"},
							 {field: 'inveDescBatchNum', title: '产品批号', width: 120, align: "center"},
							 {field: 'proNum', width: 80, title: '数量', sort: true, align: "center", totalRow: true},
							 {field: 'inveDescPrice', width: 110, title: '预设进价', sort: true, align: "center",  totalRow: true,templet:function (data) {
                                     var price = parseFloat(data.inveDescPrice).toFixed(2); //设置小数点后个数
                                     return price;
							 }},
							 {field: 'inveDescTotalPrice', width: 110, title: '进价总额', sort: true, align: "center",  totalRow: true,templet:function (data) {
                                     var price = parseFloat(data.inveDescTotalPrice).toFixed(2); //设置小数点后个数
                                     return price;
							 }},
							 {field: 'invePresetPrice', width: 110, title: '预设售价', sort: true, align: "center", totalRow: true,templet:function (data) {
                                     var price = parseFloat(data.invePresetPrice).toFixed(2); //设置小数点后个数
                                     return price;
							 }},
							 {field: 'invePresetTotalPrice', width: 120, title: '售价总金额', sort: true, align: "center", totalRow: true,templet:function (data) {
                                     var price = parseFloat(data.invePresetTotalPrice).toFixed(2); //设置小数点后个数
                                     return price;
							 }},
                             {field: 'inveDescStartDate', width: 120, title: '生产日期', align: "center"},
                             {field: 'inveDescValidityDate', width: 120, title: '有效期至', align: "center"},
                             {field: 'inveDescManufacturer', width: 130, title: '生产厂商', align: "center"},
							 {field: 'addComment', width: 120, title: '备注', align: "center"},
							 {fixed: 'right', title:'操作', toolbar: '#operateBar', width:100, align: "center"}
						 ]],
						 done : function(res, curr, count){
                             breakageCounts = count;
                             renderSelects ();
	                     },
						 limits: [10, 15, 20, 25, 50, 100],
						 limit: 10,
						 page: true
					});

                    //日期是否补0操作
                    function isAddZero(num){
                        return num<10 ? "0"+num : num;
                    }
                    //生成随机报损/报溢编号
                    function createSalesOrdId(){
                        var date = new Date();

                        var y = isAddZero(date.getFullYear()); //获取当前年
                        var month = isAddZero(date.getMonth() + 1); //获取当前月
                        var d = isAddZero(date.getDate()); //获取当前日
                        var h = isAddZero(date.getHours());//获取当前小时数(0-23)
                        var m = isAddZero(date.getMinutes());//获取当前分钟数(0-59)
                        var s = isAddZero(date.getSeconds());//获取当前秒

                        return y+month+d+h+m+s;
                    }

                    //获取商品为报损还是报溢
                    var comState = '报损';
                    $('#breakOddNumbers').html('BS'+createSalesOrdId());
                    $("input[name='proBadId']").val($('#breakOddNumbers').html());
                    form.on('select(combeakorover)',function(data){
                        comState = data.value;
                        $('#comStateTittle').html('商品'+comState);
                        $('#comStateDate').html(comState+'日期：');
                        switch (comState){
							case "报损":
								$('#breakOddNumbers').html('BS'+createSalesOrdId());
                                $("input[name='proBadId']").val($('#breakOddNumbers').html());
							    break;
                            case "报溢":
                                $('#breakOddNumbers').html('BY'+createSalesOrdId());
                                $("input[name='proBadId']").val($('#breakOddNumbers').html());
                                break;
						}
                    });

                    //等待加载仓库信息
                    var loadIndex = layer.load(1, {
                        shade: [0.5,'#fff'], //0.1透明度的白色背景
                    });
					//将仓库信息赋值给下拉框
                    $.ajax({
                        url: '/searchDepotInfoProcess',
                        dataType: 'json',
                        type: 'get',
                        success: function (data) {
                            layer.close(loadIndex);
                            $.each(data, function (index, item) {
                                // 下拉菜单里添加元素
                                $('#depotId').append(new Option(item.depotName,item.depotId));
                            });
                            //重新渲染 固定写法
                            layui.form.render("select");
                        }
                    });

                    //将经办人赋值给下拉框
                    $.ajax({
                        url: '/searchHandlePersonInfoProcess',
                        dataType: 'json',
                        type: 'get',
                        success: function (data) {
                            $.each(data, function (index, item) {
                                // 下拉菜单里添加元素
                                $('#empId').append(new Option(item.empName,item.empId));
                            });
                            //重新渲染 固定写法
                            layui.form.render("select");
                        }
                    });

                    //创建一个集合用于存储选中行的下标
                    var trIndexList = [];
                    //监听表格复选框选择
                    table.on('checkbox(comBreakOverflow)', function (obj) {
                        //获取选中行的下标(从零开始)
                        var trIndex = obj.tr.attr('data-index');
                        //获取是否为全选
                        var isAll = table.checkStatus('comBreakOverflow').isAll;

                        //判断是全选则添加所有所选商品
                        if(isAll){
                            trIndexList = [];
                            for(var i = 0,len = chooseBreakInfoLists.length;i < len; i++){
                                trIndexList.push(i);
                            }
                        }else if(undefined == trIndex){
                            //判断是反选清空所有所选商品
                            trIndexList = [];
                        }else{
                            // 判断复选框的选中状态，进行增加 | 删除
                            if(obj.checked){
                                //添加选中的下标至数组末尾
                                trIndexList.push(trIndex);
                            }else {
                                //从数组中删除取消的一个元素
                                trIndexList.splice($.inArray(trIndex,trIndexList),1);
                            }
                        }
                    });

					//监听表格头部工具栏
					table.on('toolbar(comBreakOverflow)', function(obj){
	                    var checkStatus = table.checkStatus('comBreakOverflow')
							,data = checkStatus.data;
						switch (obj.event) {
							case "getAddCom":
								insertNewCommodityInfo();
								break;
							case "getDelCom":
                                //升序排列
                                trIndexList = trIndexList.sort();
                                if(0 != breakageCounts){
                                    if(null != trIndexList && 0 < trIndexList.length){
                                        layer.confirm("是否要删除所选商品信息？",function(index){
                                            //循环遍历选中的行下标
                                            for(var i = 0,len = trIndexList.length;i < len;i++){
                                                //删除选中的数据行
                                                chooseBreakInfoLists.splice(trIndexList[i],1);
                                                //判断选中的行数大于一条且不是最后一条时，改变后一条的位置的值
                                                if(1 < trIndexList.length && i != trIndexList.length -1){
                                                    //后一条前移(i+1)位
                                                    trIndexList[i + 1] = trIndexList[i + 1] - 1 - i;
                                                }
                                            }
                                            //重载数据表格
                                            table.reload('comBreakOverflow', {
                                                data: chooseBreakInfoLists
                                            });
                                            //清空保存下标位置的数组
                                            trIndexList = [];
                                            renderSelects ();
                                            //关闭弹窗
                                            layer.close(index);
                                        });
									}else {
                                        layer.msg('没有选择待删除的数据！',{time:2000,shift:6});
									}
                                }else {
                                    layer.msg('单据中没有业务发生不能删除！',{time:2000,shift:6});
								}
								break;
						}
					});
					
					//监听表格编辑功能
					var breakageProdata;
					table.on('tool(comBreakOverflow)', function(obj){
					    var data = obj.data;
						switch (obj.event) {
							case "edit":
                                //区分编辑后刷新的表格
                                window.editProductFlag = true;
                                //声明全局的变量以供子窗体使用
                                window.table = tableList[0];
	                            layer.open({
	                                type: 2,
	                                title: '<h3 style="color: #1E9FFF;font-weight: bold;">商品信息<h3>',
	                                shade: 0.2,
	                                maxmin:true,
	                                shadeClose: true,
	                                area: ['75%', '89%'],
	                                scrollbar: false,
	                                content:'inventeditProduct.html',
	                                success: function (layero) {
	                                    breakageProdata = data;
	                                    window.breakageProdata = JSON.stringify(breakageProdata);
                                        var state = $(layero).find('iframe').contents().find('#proInvType');
                                        state.val(comState);
	                                }
	                            });
								break;
						}
					});

					//弹出层新商品添加
					function insertNewCommodityInfo() {
						var index = layer.open({
							type: 2,
							title: '<h3 style="color: #1E9FFF;font-weight: bold;">增加商品（商品'+comState+'）<h3>',
							shade: 0.2,
							maxmin:true,
							shadeClose: true,
							area: ['100%', '100%'],
							scrollbar: false,//屏蔽浏览器滚动条
							content:'inventaddProduct.html',
							success: function(layero) {
								var state = $(layero).find('iframe').contents().find('#comaddstate');
								state.val(comState);

                                var inveDescDepot = $(layero).find('iframe').contents().find('#inveDescDepot');
                                inveDescDepot.val($('#depotId').val());
                                //将仓库ID声明为全局变量
                                window.selectDescDepot = $('#depotId').val();
							},
                            end:function () {
                                table.reload('comBreakOverflow',{
                                    // 填充信息
                                    data: chooseBreakInfoLists
                                });
                            },
							cancel: function (index) {
                                var iframeWindow = window['layui-layer-iframe' + index]  //获取弹框页面
                                //获取所选商品条数
								var checkStatus = iframeWindow.layui.table.cache["selectProInfo"].length;
                                //判断是否有商品条数
								if(0 == checkStatus){
								    layer.close(index);
								}else{
                                    layer.confirm('<span style="display:block;margin: auto;text-align: center;">您还有数据未保存，确认退出吗？</span>',{
                                        title: '提示',
                                        skin : "my-skin",
                                        btn : [ '确定', '取消' ],
                                        yes: function (isExit) {
                                            layer.close(index);
                                            layer.close(isExit);
                                        }
                                    });
                                }
								return false;
                            }
						});
						
						$(window).on("resize", function() {
							layer.full(index);
						});
					};

					//监听提交
	                form.on('submit(commitBreakInfoBtn)',function () {
	                    if(0 != breakageCounts){
                            layer.confirm("单据提交后不能再修改，是否确认提交！",{title: "提示"}, function(index){
                                $("#depotId").attr("disabled",false);
                                $("#receiptsType").attr("disabled",false);
                                form.render('select');
                                var breakageInfoTop =  $('#breakageInfoTop').serialize();
                                var breakageInfoDown =  $('#breakageInfoDown').serialize();

                                //获取到报损商品明细的新增信息，存入指定数组中
                                var proBeakMoreDesc = [];
                                switch($('#comStateTittle').html()){
									case "商品报损":
                                        for(var i=0,len=chooseBreakInfoLists.length;i<len;i++){
                                            var proBeakDesc = chooseBreakInfoLists[i];
                                            proBeakMoreDesc.push({
												"proBadDescId":($('#breakOddNumbers').html())+i,
                                                "proBadId":$('#breakOddNumbers').html(),
                                                "proId":proBeakDesc.proId,
                                                "proBadDescName":proBeakDesc.inveDescName,
                                                "proBadDescUnit":proBeakDesc.inveDescUnit,
                                                "proBadDescSize":proBeakDesc.inveDescSize,
                                                "proBadDescBatchNum":proBeakDesc.inveDescBatchNum,
                                                "proBadDescStartDate":proBeakDesc.inveDescStartDate,
                                                "proBadDescValidityDate":proBeakDesc.inveDescValidityDate,
                                                "proBadDescManufacturer":proBeakDesc.inveDescManufacturer,
                                                "proBadDescNum":proBeakDesc.proNum,
                                                "proBadDescBidPrice":proBeakDesc.inveDescPrice,
                                                "proBadDescSellPrice":proBeakDesc.invePresetPrice,
                                                "proBadDescComment":proBeakDesc.addComment,
												"depotId":$("#depotId").val(),
												"proBadDate":$("#proBadDate").val()
											});
                                        }
                                        //转成JSON字符串格式后去除 '[' 与 ']'
                                        proBeakMoreDesc = JSON.stringify(proBeakMoreDesc).replace('[','').replace(']','');

                                        //局部刷新进行操作，跳转页面
										$.ajax({
                                            url: "/updateBreakageDescProcess/"+proBeakMoreDesc+"?"+breakageInfoTop+"&"+breakageInfoDown,
                                            type: 'post',
                                            success: function (obj) {
                                                if(JSON.parse(obj)){
                                                    layer.msg('新增报损信息成功！',{time:1000},function () {
                                                        location.href='inventorybreakage.html';
                                                    });
                                                }else{
                                                    layer.msg('新增报损信息失败！',{time:2000,shift:6},function () {
                                                        location.href='inventorybreakage.html';
                                                    });
                                                }
                                            }
										});
									    break;
                                    case "商品报溢":
                                        for(var j=0,leng=chooseBreakInfoLists.length;j<leng;j++){
                                            var proMoreDesc = chooseBreakInfoLists[j];
                                            proBeakMoreDesc.push({
                                                "proMoreDescId":($('#breakOddNumbers').html())+j,
                                                "proMoreId":$('#breakOddNumbers').html(),
                                                "proId":proMoreDesc.proId,
                                                "proMoreDesc":proMoreDesc.inveDescName,
                                                "proMoreDescProUnit":proMoreDesc.inveDescUnit,
                                                "proMoreDescProSize":proMoreDesc.inveDescSize,
                                                "proMoreDescProBatchNum":proMoreDesc.inveDescBatchNum,
                                                "proMoreDescStartDate":proMoreDesc.inveDescStartDate,
                                                "proMoreDescValidityDate":proMoreDesc.inveDescValidityDate,
                                                "proMoreDescManufacturer":proMoreDesc.inveDescManufacturer,
                                                "proMoreDescNum":proMoreDesc.proNum,
                                                "proMoreDescBidPrice":proMoreDesc.inveDescPrice,
                                                "proMoreDescSellPrice":proMoreDesc.invePresetPrice,
                                                "proMoreDescComment":proMoreDesc.addComment,
                                                "depotId":$("#depotId").val(),
                                                "proMoreDate":$("#proBadDate").val()
                                            });
                                        }
                                        //转成JSON字符串格式后去除 '[' 与 ']'
                                        proBeakMoreDesc = JSON.stringify(proBeakMoreDesc).replace('[','').replace(']','');

                                        //局部刷新进行操作，跳转页面
                                        $.ajax({
                                            url: "/updateMoreDescProcess/"+proBeakMoreDesc+"?"+breakageInfoTop+"&"+breakageInfoDown,
                                            type: 'post',
                                            success: function (obj) {
                                                if(JSON.parse(obj)){
                                                    layer.msg('新增报溢信息成功！',{time:1000},function () {
                                                        location.href='inventorybreakage.html';
                                                    });
                                                }else{
                                                    layer.msg('新增报溢信息失败！',{time:2000,shift:6},function () {
                                                        location.href='inventorybreakage.html';
                                                    });
                                                }
                                            }
                                        });

                                        //重置单据类型和仓库名称
                                        break;
								}

                                layer.close(index);
                            });
						}else {
                            layer.msg('单据中没有业务发生不能提交！',{time:2000,shift:6});
                		}
            		});

					/**************************************** 报损/报溢查询 ********************************************/
					//日期控件
					laydate.render({
                        elem: "#startBreakageDate",
						value: new Date(new Date().setDate(1))
                    });
                    laydate.render({
                        elem: "#stopBreakageDate",
						value: new Date()
                    });

                    //获取单据类型为报损还是报溢
                    var receiptsType = '报损';
                    form.on('select(receiptsType)',function(data){
                        //获取开始和截至时间
                        var searchBreakInfo = $('#searchBreakInfo').serialize();
                        receiptsType = data.value;
                        $('#breakMoreDate').html(receiptsType+'时间：');
                        $('#inventoryList').html(receiptsType);

                        //为不同单据类型加载不同数据
                        switch (receiptsType) {
                            case "报损":
                                table.reload('invBreakList',{
                                    url:'/searchProductBreakageInfoProcess?'+searchBreakInfo,
                                    page:{curr:1}
                                },'data');
                                //调用单击库存列表报损行加载相对应的详细信息方法
                                clickLoadBreakData();
                                break;
                            case "报溢":
                                table.reload('invBreakList',{
                                    url:'/searchProductOverflowInfoProcess?'+searchBreakInfo,
                                    page:{curr:1}
                                },'data');
                                //单击库存列表报溢行加载相对应的详细信息的方法方法
                                clickLoadMoreData();
                                break;
                        }
                    });

					//序列化报损/报溢表单信息
                    var searchBreakInfo = $('#searchBreakInfo').serialize();

					//库存报损列表
                    table.render({
                        elem: '#invBreakList',
                        url: '/searchProductBreakageInfoProcess?'+searchBreakInfo,
                        toolbar: '#toolbarDemo',
                        defaultToolbar: ['filter', 'exports', 'print', {
                            title: '提示',
                            layEvent: 'LAYTABLE_TIPS',
                            icon: 'layui-icon-tips'
                        }],
                        cols: [[
                            {field: 'proBadId', width: 160, title: '单号', sort: true, fixed:'left', align: "center"},
                            {field: 'proBadDate', width: 130, title: '日期', sort: true, align: "center"
                                ,templet:"<div>{{layui.util.toDateString(d.proBadDate, 'yyyy-MM-dd')}}</div>"},
                            {field: 'depotName', width: 150, title: '仓库名称', align: "center"},
                            {field: 'empName', width: 130, title: '经办人', align: "center"},
                            {field: 'empName', title: '操作员', width: 130, align: "center"},
                            {field: 'proBadComment', minWidth: 130, title: '备注', align: "center"}
                        ]],
                        done: function (res, curr, count) {
                            $('.layui-table-view[lay-id="invBreakList"]')
                                .children('.layui-table-box')
                                .children('.layui-table-body')
                                .find('table tbody tr[data-index="0"]').click();
                        },
                        limits: [5,10, 15, 20, 25, 50, 100],
                        limit: 5,
                        page: true
                    });

                    //单据的详细信息表
                    table.render({
                        elem: '#invReceiptsDesc',
                        data:[],
                        cols: [[
                            {field: 'proId', width: 110, title: '商品编号', sort: true, fixed:'left', align: "center"},
                            {field: 'proBadDescName', width: 220, title: '商品名称', align: "center"},
                            {field: 'proTypeName', width: 110, title: '商品类别', align: "center"},
                            {field: 'proBadDescNum', width: 80, title: '数量', sort: true, align: "center"},
                            {field: 'proBadDescBidPrice', title: '成本价', width: 90, sort: true, align: "center"},
                            {field: 'proBadDescTotalPrice', width: 90, title: '总成本', sort: true, align: "center"},
                            {field: 'proBadDescUnit', width: 80, title: '单位', align: "center"},
                            {field: 'proBadDescSize', width: 110, title: '规格', align: "center"},
                            {field: 'proBadDescBatchNum', width: 120, title: '批号', align: "center"},
                            {field: 'proBadDescValidityDate', width: 140, title: '有效期至', sort: true, align: "center"
                                ,templet:"<div>{{layui.util.toDateString(d.proBadDescValidityDate, 'yyyy-MM-dd')}}</div>"},
                            {field: 'proBadDescComment', width: 135, title: '备注', align: "center"},
                        ]],
                        page: false
                    });
                    
                    //单击库存列表报损行加载相对应的详细信息的方法
					function clickLoadBreakData() {
					    var receiptsData ="";
                        table.on('row(invBreakList)' ,function(obj){
                            obj.tr.addClass('layui-bg-green').siblings().removeClass('layui-bg-green');
                            receiptsData = obj.data;
                            table.reload('invReceiptsDesc',{
                                url:'/searchBreakageDescInfoProcess/'+receiptsData.proBadId
                            },'data');
                            //页面动态显示报损/报溢编号
                            $('.title01').html(receiptsData.proBadId);
                        });
                        table.reload('invReceiptsDesc',{
                            url:'/searchBreakageDescInfoProcess/'+receiptsData.proBadId
                        },'data');
                        //报损/报溢编号清空
                        $('.title01').html('');
                    }

                    //单击库存列表报溢行加载相对应的详细信息的方法
					function clickLoadMoreData() {
                        var receiptsData = "";
                        table.on('row(invBreakList)' ,function(obj){
                            obj.tr.addClass('layui-bg-green').siblings().removeClass('layui-bg-green');
                            receiptsData = obj.data;
                            table.reload('invReceiptsDesc',{
                                url:'/searchOverflowDescInfoProcess/'+receiptsData.proBadId
                            },'data');
                            //报损/报溢编号清空
                            $('.title01').html(receiptsData.proBadId);
                        });
                        table.reload('invReceiptsDesc',{
                            url:'/searchOverflowDescInfoProcess/'+receiptsData.proBadId
                        },'data');
                        //页面动态显示报损/报溢编号
                        $('.title01').html('');
                    }

                    //调用单击库存列表报损行加载相对应的详细信息的方法
                    clickLoadBreakData();

                    //监听报损/报溢时间查询
                    form.on('submit(data-searchBreakMore-btn)',function () {
                        //获取开始和截至时间
                        var searchBreakInfo = $('#searchBreakInfo').serialize();
                        var receiptsData ="";
                        //为不同单据类型加载不同数据
                        switch (receiptsType) {
                            case "报损":
                                table.reload('invBreakList',{
                                    url:'/searchProductBreakageInfoProcess?'+searchBreakInfo,
                                    page:{curr:1}
                                },'data');
                                clickLoadBreakData();
                                break;
                            case "报溢":
                                table.reload('invBreakList',{
                                    url:'/searchProductOverflowInfoProcess?'+searchBreakInfo,
                                    page:{curr:1}
                                },'data');
                                clickLoadMoreData();
                                break;
                        }
                    });
				});
			});
		</script>
	</body>
</html>
